<!DOCTYPE html>
<!--suppress ALL-->
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/common :: common_head(~{::title},~{},~{})">
    <meta charset="UTF-8">
    <meta content="text/html; charset=UTF-8" http-equiv="content-type">
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
    <meta content="widt h=device-width, initial-scale=1.0" name="viewport">
    <title>index</title>
</head>
<style>
    body {
        background: #eeeff3;
        font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
    }

    .bg-purple {
        font-size: 20px;
    }

    #app {
        display: flex;
        flex-direction: column;
        background: #eeeff3;
    }

    .data_statistics {
        height: auto;
        border-radius: 10px;
        background: #ffffff;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .data_statistics_item {
        flex: 1;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        min-width: 150px;
        max-width: 280px;
        height: 100px;
        border-right: 2px solid #eeeff3;
    }

    .item_icon {
        padding: 0 10px;
    }

    .item_data .item_data_name {
        height: auto;
        min-height: 25px;
    }

    .item_data .item_data_num {
        font-weight: 600;
        font-size: 24px;
        color: #f00404;
    }

    .echarts_iframe {
        margin-top: 10px;
        width: 100%;
        background: #ffffff;
        border-radius: 10px;
    }

</style>
<body>
<div id="app" onselectstart="return false">
    <div class="data_statistics">
        <!--质量规则执行数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toRulePage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/execute.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.zlgzzxs.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.zlgzzxs.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
        <!--制定标准总数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toProjectPage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/appoint.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.zdbzzs.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.zdbzzs.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
        <!--发现质量问题数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toOrderPage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/discover.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.fxzlwts.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.fxzlwts.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
        <!--已发布标准总数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toPublishProjectPage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/issue.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.yfbzs.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.yfbzs.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
        <!--解决质量问题数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toCompleteOrderPage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/solve.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.jjzlwts.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.jjzlwts.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
        <!--待解决质量问题数-->
        <div class="data_statistics_item">
            <div class="item_icon">
                <a @click="toMyorderPage" style="display: block" href="javascript:void(0)">
                    <img th:src="@{/svg/beSolved.svg}"></img>
                </a>
            </div>
            <div class="item_data">
                <div class="item_data_name">
                    {{dataCountObj.dwjjwts.name}}
                </div>
                <div class="item_data_num">
                    {{(Number(dataCountObj.dwjjwts.num) || 0).toLocaleString()}}
                </div>
            </div>
        </div>
    </div>

    <div class="echarts_iframe">
        <iframe height="700px" style="border:none;" th:src="@{/echarts}" width="100%">
        </iframe>
    </div>
</div>
<!--/* 加载IE8兼容性脚本 */-->
<th:block th:replace="common/thinDecorator::IE8FixScripts"/>
<!--/* 加载核心插件脚本 */-->
<th:block th:replace="common/thinDecorator::corePluginsScripts"/>
<script th:src="@{/static/global/plugins/bootstrap-fileinput/bootstrap-fileinput.js}" type="text/javascript"></script>
<!--/* 加载全局主题脚本 */-->
<th:block th:replace="common/thinDecorator::globalThemeScripts"/>
<!-- BEGIN alert插件 -->
<script th:src="@{/static/global/plugins/bootstrap-sweetalert/sweetalert.min.js}" type="text/javascript"></script>
<!-- END -->
<!--/* 加载全局布局脚本 */-->
<th:block th:replace="common/thinDecorator::globalLayoutScripts"/>
<th:block th:replace="common/thinDecorator::globalsetupScripts"/>
<script th:inline="javascript" type="text/javascript">
    const app = new Vue({
        el: '#app',//绑定节点
        data: {
            activeIndex2: '1',
            gridData: [], // 一级菜单
            encrypt: {},//加密对象
            pubkey: " ",//session中获取公钥
            dataCountObj: {
                zlgzzxs: {
                    num: 1000,
                    name: '质量规则执行数'
                },
                fxzlwts: {
                    num: 1200,
                    name: '发现质量问题数'
                },
                dwjjwts: {
                    num: 5654,
                    name: '待我解决问题数'
                },
                jjzlwts: {
                    num: 543,
                    name: '解决质量问题数'
                },
                zdbzzs: {
                    num: 156,
                    name: '制定标准总数'
                },
                yfbzs: {
                    num: 756,
                    name: '已发布标准总数'
                },
            },
        },
        created() {
            this.initByAES();
        },
        watch: {//监听-属性

        },
        mounted() {


        },
        methods: {
            initByAES() {
                let that = this;
                // 发起 GET 请求
                axios.get(contentPath + 'indexCount')
                    .then(response => {
                        // 请求成功处理
                        // that.dataCountObj = response.data.data;
                        if (!response.data.data) return
                        for (const responseKey in response.data.data) {
                            that.dataCountObj[responseKey].num = response.data.data[responseKey]
                        }
                    })
                    .catch(error => {
                        // 请求失败处理
                        console.error(error);
                    });
            },
            loginTest() {
                let sendData = {
                    username: "admin",
                    password: "admin"
                }
                //模拟登录
                axios.post(contentPath + 'logging', JSON.stringify(sendData)).then(resp => {
                    if (resp.data.code == 200) {
                        console.log("模拟登录成功-admin用户+");
                        localStorage.setItem('token', resp.data.data);
                    } else {
                        console.log(resp);
                    }

                }).catch(error => {
                    console.log(error)
                });
            }, handleSelect() {

            }, handleChange() {

            },
            toOrderPage(){
                window.top.app.addTag({
                    url: '/qa/question/order/list',
                    name: '问题工单',
                    reload: 0,
                })
            },
            toMyorderPage(){
                window.top.app.addTag({
                    url: '/qa/question/myorder/list',
                    name: '我的工单',
                    reload: 0,
                })
            },
            toCompleteOrderPage(){
                localStorageManage.get()
                let url = '/qa/question/order/list?status=3'
                window.top.app.addTag({
                    url: url,
                    name: '问题工单',
                    reload: 0,
                })
            },
            toProjectPage(){
                window.top.app.addTag({
                    url: '/qa/biaozhun/list',
                    name: '数据质量标准管理',
                    reload: 0,
                })
            },
            toPublishProjectPage(){
                window.top.app.addTag({
                    url: '/qa/formalList',
                    name: '数据标准正式帐',
                    reload: 0,
                })
            },
            toRulePage(){
                window.top.app.addTag({
                    url: '/qa/sqlTask/list',
                    name: '执行详情',
                    reload: 0,
                })
            },
        }
    });
</script>
</body>
</html>